<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>账单报表</title>
</head>

<link href="/pages/common/layui/css/layui.css" rel="stylesheet">
<link href="./css/public.css" rel="stylesheet">
<style>
body{
	margin: 0;
}
.yellow{
	background-color:yellow;
}
</style>

<script type="text/javascript"> 

	Date.prototype.Format = function (fmt) { //author: meizz 
	    var o = {
	        "M+": this.getMonth() + 1, //月份 
	        "d+": this.getDate(), //日 
	        "h+": this.getHours(), //小时 
	        "m+": this.getMinutes(), //分 
	        "s+": this.getSeconds(), //秒 
	        "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
	        "S": this.getMilliseconds() //毫秒 
	    };
	    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
	    for (var k in o)
	    if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
	    return fmt;
	}

</script>

<body>
  	
<div class="layui-container" style="width: 90%;margin-top: 30px;">

  	<div class="layui-row layui-col-space15">


		<!-- 全局时间范围选择 -->

		<div class="layui-col-sm12">
			<div class="layui-card">
				<div class="layui-card-header" style="height: 52px;">

					<div class="layui-form" style="min-width: 400px;max-height: 30px;display: inline-flex; margin-top: 8px;">
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label" style="padding: 9px 8px">时间范围</label>
								<div class="layui-input-inline">
									<input class="layui-input" id="globalDate"  value=""   placeholder=" " type="text">
								</div>
							</div>
						</div>

						<div class="layui-form-item" >
							<div class="layui-inline" >
								<div class="layui-input-inline" style="width: 80px;">
									<select class="global-time-unit" name="timeUnit"  lay-filter="global-time-unit">
										<option value="1" selected>所有</option>
										<option value="2">今年</option>
										<option value="3">本月</option>
										<option value="4">今天</option>
									</select>
								</div>
							</div>

							<div class="layui-inline" >
								<span style="color: red;" class="prompt_info"></span>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>


			<div class="layui-row layui-col-space12" style="margin-top:5%">

				<div class="layui-col-sm6 layui-col-md4">
					<div class="layui-card">
						<div class="layui-card-header">未领取红包金额
						</div>
						<div class="layui-card-body layuiadmin-card-list">
							<p class="layuiadmin-big-font redpacketOverTotal"></p>
						</div>
					</div>
				</div>

				<div class="layui-col-sm6 layui-col-md4">
					<div class="layui-card">
						<div class="layui-card-header">转账未领取金额
						</div>
						<div class="layui-card-body layuiadmin-card-list">
							<p class="layuiadmin-big-font transferOverTotal"></p>
						</div>
					</div>
				</div>

				<div class="layui-col-sm6 layui-col-md4">
					<div class="layui-card">
						<div class="layui-card-header">充值金额
						</div>
						<div class="layui-card-body layuiadmin-card-list">
							<p class="layuiadmin-big-font rechargeTotal"></p>
						</div>
					</div>
				</div>

			</div>

			
			<div class="layui-row layui-col-space12" style="margin-top:5%">
				<div class="layui-col-sm6 layui-col-md4">
					<div class="layui-card">
						<div class="layui-card-header">提现金额
						</div>
						<div class="layui-card-body layuiadmin-card-list">
							<p class="layuiadmin-big-font cashTotal"></p>
						</div>
					</div>
				</div>
				<div class="layui-col-sm6 layui-col-md4">
					<div class="layui-card">
						<div class="layui-card-header">提现手续费
						</div>
						<div class="layui-card-body layuiadmin-card-list">
							<p class="layuiadmin-big-font serviceChargeTotal"></p>
						</div>
					</div>
				</div>

			</div>

		

		

		



		
		
		


    	
	</div>
</div>

<script type="text/javascript" src="/pages/common/jquery/jquery.min.js"></script>
<script type="text/javascript" src="/pages/console/assets/xss-filters.1.2.7.min.js"></script>
<script type="text/javascript" src="/pages/common/jquery/jquery.md5.js"></script>
<script type="text/javascript" src="/pages/common/layui/layui.all.js"></script>
<script type="text/javascript" src="/pages/common/echarts/shine.js"></script>
<script type="text/javascript" src="/pages/console/js/common.js"></script>


<script type="text/javascript" >

	var startTime=0;
	var endTime=0;

	$(function(){

		layui.use('laydate', function(){
			var laydate = layui.laydate,
					form  = layui.form;

			form.render('select');


			//日期范围
			var time =  laydate.render({
				elem: '#globalDate'
				,range: "~"
				,done: function(value, date, endDate){  // choose end
					//console.log("date callBack====>>>"+value); //得到日期生成的值，如：2017-08-18
					var startDate = value.split("~")[0];
					var endDate = value.split("~")[1];
					if(startDate){
						startTime=BillCount.dateToSeconds(new Date(startDate));
					}
					if(endDate){
						endTime=BillCount.dateToSeconds(new Date(endDate));
					}
					BillCount.queryBillCount(startTime,endTime);



				}
				,max: 0
			});




			layui.form.on('select(global-time-unit)', function(data){
				var dateRange = $("#globalDate").val();

				var endDate=new Date();
				endTime=BillCount.dateToSeconds(endDate);
				startDate=new Date(endDate);
				if(data.value==1){//时间单位切换到年

					endTime=0;

					startTime=0;

				}else if(data.value==2){//时间单位切换到年

					startDate.setFullYear(endDate.getFullYear()-1);

					startTime=BillCount.dateToSeconds(startDate);

				}else if(data.value==3){//时间单位切换到月

					startDate.setMonth(endDate.getMonth()-1);

					startTime=BillCount.dateToSeconds(startDate);

				}else if(data.value==4){ //时间单位切换到天
					startTime=endTime-86400;
					$("#globalDate").val();



					//$(".prompt_info").text("注：时间单位若为分钟，不能选择时间范围,只会显示当前这一天的数据");

					dateRange = "";
				}else{

				}


				BillCount.queryBillCount(startTime,endTime);


			});







		});



		BillCount.queryBillCount(0,0);


	});



	var  BillCount = {

		/** 获取用户房间好友等总数量 **/
		queryBillCount : function(startTime,endTime){
			startTime=parseInt(startTime);
			endTime=parseInt(endTime);
			Common.invoke({
				url : request('/console/billCount'),
				data : {"startTime":startTime,
						"endTime":endTime
						},
				successMsg : false,
				errorMsg :  "加载数据失败，请稍后重试",
				success : function(result) {

					var totalData = result.data;
					console.log(totalData);
					var redpacketOverTotal="0.0";

					var transferOverTotal="0.0";
					var rechargeTotal="0.0";
					var cashTotal="0.0";
					var serviceChargeTotal="0.0";
					if(totalData.redpacketOverTotal){
						redpacketOverTotal=totalData.redpacketOverTotal;
					}
					if(totalData.transferOverTotal){
						transferOverTotal=totalData.transferOverTotal;
					}
					if(totalData.rechargeTotal){
						rechargeTotal=totalData.rechargeTotal;
					}
					if(totalData.cashTotal){
						cashTotal=totalData.cashTotal;
					}
					if(totalData.serviceChargeTotal){
						serviceChargeTotal=totalData.serviceChargeTotal;
					}
					$(".redpacketOverTotal").text(redpacketOverTotal);
					$(".transferOverTotal").text(transferOverTotal);
					$(".rechargeTotal").text(rechargeTotal);
					$(".cashTotal").text(cashTotal) ;
					$(".serviceChargeTotal").text(serviceChargeTotal) ;

				},
				error : function(result) {
				}
			});
		},
		dateToSeconds:function(date){
			return date.getTime()/1000;
		}



	}
</script>


</body>
</html>